<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
  <style type="text/css">
    body, html, #allmap {
      width: 100%;
      height: 100%;
      overflow: hidden;
      margin: 0;
      font-family: "微软雅黑";
    }

    .anchorBL {
      display: none;
    }
  </style>
  <script type="text/javascript"
          src="http://api.map.baidu.com/api?v=2.0&ak=dpB1d25b7smGMe8evaIAxw881Aq3AUfb"></script>
  <title></title>
</head>
<body>
<div id="allmap">
  <script type="text/javascript">

    // 百度地图API功能
    var map = new BMap.Map("allmap");
    map.centerAndZoom("枣庄学院", 14);
    var walking = new BMap.WalkingRoute(map, {
      renderOptions: {
        map: map,
        autoViewport: true
      }
    });

    map.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用
    map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用
    //路况
    var traffic = new BMap.TrafficLayer();        // 创建交通流量图层实例
    map.addTileLayer(traffic);                    // 将图层添加到地图上

    //浏览器定位
    /*var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.panTo(r.point);
            alert('您的位置：'+r.point.lng+','+r.point.lat);
        }
        else {
            alert('failed'+this.getStatus());
        }
    });
*/

    // 两点间最短路线规划
    var myIcon = new BMap.Icon("./start.png", new BMap.Size(20, 26));
    var _points = [];
    map.addEventListener("click", function (e) {
      var _point = {
        lng: "",
        lat: ""
      };
      _point.lng = e.point.lng;
      _point.lat = e.point.lat;
      _points.push(_point);
      map.addOverlay(new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat), {icon: myIcon}));
      console.log(_points);
      // alert(e.point.lng + "," + e.point.lat);
      if (_points.length === 2) {
        var start = new BMap.Point(_points[0].lng, _points[0].lat);
        var end = new BMap.Point(_points[1].lng, _points[1].lat);
        walking.search(start, end);
        map.clearOverlays();
        _points = [];
      }
    });


    // 下面是地图的标注
    // 枣院帮养之家
    map.addOverlay(marker);                     // 将标注添加到地图中
    var point1 = new BMap.Point(117.54466806484423, 34.90694205532435);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("枣院帮养之家"+"<br/>"+"负责人：李海琳"+"<br/>"+"联系电话:17861918889"+"<br/>"+"信用等级:一星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 单击窗口显示模板
    // var point = new BMap.Point(117.54466806484423, 34.90694205532435);
    // var marker = new BMap.Marker(point);        // 创建标注
    //监听事件--点击marker --- marker.addEventListener("click", function(){   })
    // marker.onclick=function(){
    //     alert('点击了marker')
    // }
    //7.信息窗口
    // var options={
    //     width:200,
    //     height:140,
    //     title:'枣庄学院'
    // }
    // //创建信息窗口
    // var infoWindow=new BMap.InfoWindow('正常运行',options);
    // //在地图上打开  窗口和位置
    // // map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
    // // map.openInfoWindow(infoWindow, point);      // 打开信息窗口
    // //点击打开marker标记---打开信息窗口
    // marker.addEventListener('click',function(){
    //     map.openInfoWindow(infoWindow, point);
    // })


    //5.地址解析
    // 创建地址解析器实例
    // var myGeo = new BMap.Geocoder()
    // // 将地址解析结果显示在地图上，并调整地图视野
    // myGeo.getPoint("山东省枣庄市市中区齐村镇北安路1号枣庄学院", function (point) {
    //     console.log(point)
    //         if (point) {
    //             map.centerAndZoom(point, 16);
    //             map.addOverlay(new BMap.Marker(point));
    //弹框信息提醒
    //创建信息窗口
    // var infoWindow=new BMap.InfoWindow('内容',options);
    // //点击打开marker标记---打开信息窗口
    //  marker.addEventListener('click',function(){
    //     map.openInfoWindow(infoWindow, point);
    // })
    //     }
    // },
    // "山东省");

    // 2渴口帮养之家
    var point1 = new BMap.Point(117.54930643395994, 34.898047221535485);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("渴口帮养之家"+"<br/>"+"负责人：王明"+"<br/>"+"联系电话:17861913321"+"<br/>"+"信用等级:一星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });


    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 3归璞帮养之家
    var point1 = new BMap.Point(117.5517311509094, 34.889828092097765);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("归璞帮养之家"+"<br/>"+"负责人：李华"+"<br/>"+"联系电话:17861945321"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 4赵村帮养之家
    var point1 = new BMap.Point(117.581856,34.893235);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("赵村帮养之家"+"<br/>"+"负责人：吴凡"+"<br/>"+"联系电话:17861918901"+"<br/>"+"信用等级:一星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 5安和帮养之家
    var point1 = new BMap.Point(117.537875,34.87914);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("安和帮养之家"+"<br/>"+"负责人：秦浩博"+"<br/>"+"联系电话:17861917788"+"<br/>"+"信用等级:一星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 6左岸帮养之家
    var point1 = new BMap.Point(117.557638,34.880);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("左岸帮养之家"+"<br/>"+"负责人：张明月"+"<br/>"+"联系电话:13256533606"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 7蓝天帮养之家
    var point1 = new BMap.Point(117.592708,34.883108);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("蓝天帮养之家"+"<br/>"+"负责人：陈龙"+"<br/>"+"联系电话:17861911458"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 8三中帮养之家
    var point1 = new BMap.Point(117.550452,34.861371);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("三中帮养之家"+"<br/>"+"负责人：唐依依"+"<br/>"+"联系电话:17861911369"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 9天宝帮养之家
    var point1 = new BMap.Point(117.522928,34.878667);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("天宝帮养之家"+"<br/>"+"负责人：陈一帆"+"<br/>"+"联系电话:17861915478"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上

    // 10乔屯帮养之家
    var point1 = new BMap.Point(117.505249,34.91076);
    var marker = new BMap.Marker(point1);        // 创建标注
    map.addOverlay(marker);                     // 将标注添加到地图中
    var myLabel = new BMap.Label("乔屯帮养之家"+"<br/>"+"负责人：孙一鸣"+"<br/>"+"联系电话:17861915948"+"<br/>"+"信用等级:二星喂养员",     //为lable填写内容
      {offset:new BMap.Size(-60,-80),                  //label的偏移量，为了让label的中心显示在点上
        position:point1});                                //label的位置
    myLabel.setStyle({
      color: "#000000",
      border: "0",
      padding: "0",
      display: "none",
      background:"rgba(255,255,255,44)",
      fontSize: "16px",
      height: "80px",
      lineHeight: "20px",
      fontFamily: "微软雅黑",

    });

    myLabel.setTitle("我是文本标注label");               //为label添加鼠标提示
    marker.setLabel(myLabel);
    marker.addEventListener("mouseover",function(e){
      var label = this.getLabel()
      label.setStyle({display:"block"});
    });
    marker.addEventListener("mouseout",function(e){
      var label = this.getLabel()
      label.setStyle({display:"none"});
    });
    map.addOverlay(myLabel);                             //把label添加到地图上


  </script>
</body>
</html>
